<template>
	<view>
		<cu-custom :isBack="false" bgColor="bg-white solids-bottom text-darkGray">
			<block slot="content">
				明日方舟wiki
			</block>
			<block slot="right"></block>
		</cu-custom>
		<view class="warp30" style="background:none;"></view>
		<view class="cu-list grid col-4 no-border" style="background:rgba(255,255,255,0.95);">
			<view class="cu-item" v-for="item in arry" :key="item._id">
				<navigator :url="'/pages/wiki/detail/detail?name='+item.name">
					<image :src="item.src" class="menu-icon" />
					<text>{{item.name}}</text>
				</navigator>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				arry:[]
			};
		},
		onLoad() {
			// #ifdef MP-WEIXIN
			var _this = this;
			wx.cloud.init();
			const db = wx.cloud.database()
			const getCount = async function(){
				const countResult = await db.collection('wiki_character').count()
				const total = countResult.total;
				const batchTimes = Math.ceil(total / 20);
				const tasks = []
				for (let i = 0; i < batchTimes; i++) {
					const promise = db.collection('wiki_character').skip(i * 20).limit(20).get();
					tasks.push(promise)
				}
				return (await Promise.all(tasks)).reduce((acc, cur) => {
					let data = cur.data;
					acc.data = acc.data.concat(...data);
					return {
						data: acc.data,
						errMsg: acc.errMsg,
					}
				})
			}
			const wikidata = getCount();
			wikidata.then(function(result){
				console.info(result.data);
				_this.arry = result.data;
			});
			// #endif
		},
		mounted:function(){
		},
	}
</script>

<style lang="less">
	.menu-icon{
		width: 150upx;
		margin: 0 auto;
		height: 150upx;
		border-radius: 10upx;
	}
	.cu-list.grid>.cu-item text{
		font-size: 24upx;
		margin-top: 0;
	}
</style>
